<%--
  Created by IntelliJ IDEA.
  User: gsb
  Date: 2019/11/22
  Time: 18:02
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>试题预览</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css">
    <link rel="stylesheet" href="/lib/zTreeStyle/zTreeStyle.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/common.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/eleTree.css">
    <script type="text/javascript" src="/js/jquery/jquery-1.9.1.js"></script>
    <script src="/lims/layui/layui.js"></script>
    <script src="/lims/js/common.js?v=20190726" type="text/javascript" charset="utf-8"></script>
    <script src="/js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js/"></script>
    <script src="/lib/layui/layui/js/baseCode/base.js?v=2019080918:09" type="text/javascript" charset="utf-8"></script>
    <style>
        .layui-form-label{width:100px;}
        .layui-input-block{margin-left:130px;}
        .layui-disabled, .layui-disabled:hover{color: #797979 !important;}
        .layui-form-checkbox i{
            width: 15px;
            height: 15px;
            margin-top: 6px;
        }
    </style>

<body>
<div>
    <!--
 自定义布局表单控件
 -->
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-body" style="padding: 15px;">
                <form class="layui-form form" action="" lay-filter="qaForm">
                    <div id="view">
                        <div class="layui-form-item">
                            <label class="layui-form-label">试题目录：</label>
                            <div class="layui-input-block mulu">

                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline" style="">
                                <label class="layui-form-label" style="">试题类型：</label>
                                <div class="layui-input-inline testType" style="width: 380px;">

                                </div>
                            </div>
                            <div class="layui-inline" style="">
                                <label class="layui-form-label" style="width:80px;">难度类型：</label>
                                <div class="layui-input-inline testDifficulty" style="width: 150px;">
                                </div>
                            </div>
                        </div>

                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">题干：</label>
                            <div class="layui-input-block stem">

                            </div>
                        </div>
                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">试题图片：</label>
                            <div class="layui-input-block" style="position: relative">
                                <div id="Attachment" ></div>
                            </div>
                        </div>
                        <div class="layui-form-item layui-form-text options">
                            <label class="layui-form-label">选项：</label>
                            <div class="layui-input-block questionLIst" style="overflow: hidden;">
                                <div class="questionCon"></div>
                            </div>
                        </div>
                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">答案：</label>
                            <div class="layui-input-block ">
                                <div class="answer"></div>
                            </div>
                        </div>
                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">答案解析：</label>
                            <div class="layui-input-block analysis">
                            </div>
                        </div>
                    </div>

                </form>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        var id = $.GetRequest().id;
        var arr=['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R'];
        var zmIndex=0;
        layui.use(['form','layer'],function(){
            var $ = layui.jquery,
                form = layui.form,
                layer = layui.layer;
            $.ajax({
                url:'/exaQuestions/selectById',
                data:{eqId:id},
                type:'get',
                dataType:'json',
                success:function(res){
                    var data = res.object;
                    var eqStatus=''
                    var eqType=''
                    if(data.eqStatus==1){
                        $('.testType').html('单选题')
                    }else if(data.eqStatus==2){
                        $('.testType').html('多选题')
                    }else if(data.eqStatus==3){
                        $('.testType').html('填空题')
                    }else if(data.eqStatus==4){
                        $('.testType').html('判断题')
                    }else if(data.eqStatus==5){
                        $('.testType').html('问答题')
                    }
                    switch (data.eqType) {
                        case '1':
                            eqType='简单';
                            break;
                        case '2':
                            eqType='中等';
                            break;
                        case '3':
                            eqType='困难';
                            break;
                    }

                    $('.testDifficulty').html(eqType)
                    $('.mulu').html(data.sortName)
                    $('.stem').html(data.eqSubject)
                    $('.analysis').html(data.analysis)
                    //获取附件
                    if(data.attachment!=''&&data.attachment!=undefined){
                        var img = '<img src="/xs?'+data.attachment.attUrl+'" />'
                        $('#Attachment').html(img)
                    }else{
                        $('#Attachment').html('')
                    }


                    //获取试题
                    if(data.eqStatus==1){ //单选
                        if(data.option!=''){
                            var optionArr = data.option.split(';')
                            var radioStr=''
                            for(var i=0;i<optionArr.length;i++){
                                if(optionArr[i]!=''){
                                    radioStr+=' <div class="layui-form-item answerList" style="margin-bottom:0px;margin-left: 3px;">\n' +
                                        '                                <div class="layui-inline" style="width: 100%;">\n' +
                                        '                                    <div class="layui-input-inline" style="width: 30px;">\n' +
                                        '                                        <input type="radio" name="" disabled  value="'+arr[zmIndex]+'" title="">\n' +
                                        '                                    </div>\n' +
                                        '                                    <div class="layui-input-inline" style="width: 50%;">\n' +
                                        '                                       <span style="line-height: 40px;">'+optionArr[i]+'</span>' +
                                        '                                    </div>\n' +
                                        '                                </div>\n' +
                                        '                            </div>'
                                    zmIndex++;
                                }

                            }
                            $('.questionLIst').html(radioStr)
                            $('.answer').html(data.answer)
                        }
                    }else if(data.eqStatus==2){ //多选

                        if(data.option!=''){
                            var optionArr = data.option.split(';')
                            var checkboxStr=''
                            for(var i=0;i<optionArr.length;i++){
                                if(optionArr[i]!=''){
                                    checkboxStr+=' <div class="layui-form-item answerList" style="margin-bottom:0px;margin-left: 3px;">\n' +
                                        '                                <div class="layui-inline" style="width: 100%;">\n' +
                                        '                                    <div class="layui-input-inline" style="width: 30px;">\n' +
                                        '                                        <input type="checkbox" disabled name=""  value="'+arr[zmIndex]+'" title="">\n' +
                                        '                                    </div>\n' +
                                        '                                    <div class="layui-input-inline" style="width: 50%;">\n' +
                                        '                                        <span style="line-height: 40px;">'+optionArr[i]+'</span>\n' +
                                        '                                    </div>\n' +
                                        '                                </div>\n' +
                                        '                            </div>';
                                    zmIndex++;
                                }

                            }
                            $('.questionLIst').html(checkboxStr)
                            $('.answer').html(data.answer)

                        }
                    }else if(data.eqStatus==4){ //填空题
                        $('.options').hide()
                        $('.answer').html(data.answer)
                    }else if(data.eqStatus==3){ //判断题
                        $('.options').hide()
                        if(data.answer==0){
                            var answer = '对'
                        }else{
                            var answer = '错'
                        }
                        $('.answer').html(answer)
                    }else if(data.eqStatus==5){ //问答
                        $('.options').hide()
                        $('.answer').html(data.answer)
                    }
                    form.render();
                }
            })

        });
    </script>
</div>
<style>
    .layui-form-checkbox i{
        border-left: 1px solid #d2d2d2;
    }
    .active{
        display: block;
    }
    .nonactive{
        display: none;
    }
    .layui-input-inline{
        margin-top:6px;
    }
    .layui-input-block{
        line-height:38px ;
    }
</style>
</body>
</html>
